<script setup lang="ts">

import { userInfo } from '@/hooks/user';

import Left from '@/views/menu/Left.vue'
import Right from './views/menu/Right.vue';
import { onMounted , nextTick } from 'vue';
onMounted(()=>{
  displayUrlParams()
})
console.log(import.meta.env); //这个显示
console.log(import.meta.env.VITE_APP_URL)  //这个 undefined


// 用浏览器的方法拿到url参数token
const displayUrlParams = ()=>{
  const displayUrlParamsParams = new URLSearchParams(window.location.search)
  console.log('url路径检测',displayUrlParamsParams);
  if (displayUrlParamsParams.size){
      const token = displayUrlParamsParams.get('token')
      console.log('token',token);
      //判断token是否存在
      if (!token) return
    userInfo(token)
  }
}
const forceRerender = ()=>{
  nextTick(()=>{
    console.log('强制刷新');    
  })
}

</script>
<template>
  <div class="container">
    <Left></Left>

    <div class="right">
      <Right class="right-list" v-if="userInfo" />
      <keep-alive>
        <RouterView class="router" />
      </keep-alive>
    </div>
  </div>


</template>

<style lang="scss"" scoped>
.container{
  position: relative;
  display: flex;
  width: 100vw;
  height: 100vh;
  // overflow: hidden;
  background-color: #f2f2f2;
}

    .right {
      flex: 1;
      height: 100%;
      // background-color: #f2f2f2;
      position: relative;
      overflow-y: auto;
      overflow-x: hidden;
      display: flex;
      position: relative;
      z-index: 8;
      // .right-list{
      // width: auto;
      // }
      .router
      {
        flex: 1;
        padding: 18px ;
        height: 100%;
        box-sizing: border-box;
        width: calc(100% - 268px);
        overflow: auto;
      }
    }
</style>
